<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <form class="login" style="margin-bottom: 10px;">
    <label style="background: #5a29e4; color: #fff;
    border-radius: 5px; padding: 5px 10px; cursor: pointer; margin-bottom: 5px;" for="user">click me</label>
    <input style="display: none;" type="file" class="upload" id="user">
  </form>
  <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
  <script>
    document.querySelector('.upload').onchange=({target})=>{
      const fd=new FormData()
      fd.append('img',target.files[0])
      axios({
        url:'http://localhost:3000',
        method:'POST',
        data:fd
      }).then(result=>{
        const{data:{imgUrl}}=result
        const image=new Image(200,200)
        image.src=imgUrl
        document.body.appendChild(image)
      })
    }
  </script>
</body>
</html>